<template>
	<view class="content">
		<image :src="data.avatar" style="height: 100vh;" mode="heightFix"></image>
		<view class="ftbg">
			<image :src="data.avatar" style="width: 160rpx;height: 160rpx;margin-top: 250rpx;border-radius: 16rpx;"
				mode=""></image>
			<view style="margin-top: 10rpx;color: white;font-size: 12rpx;">
				{{data.name}}
			</view>
			<view style="margin-top: 130rpx;color: white;">
				正在等待对方回应...
			</view>
		</view>

		<view
			style="position: fixed;bottom: 100rpx;left: 0rpx;width: 100%;display: flex;justify-content: center;align-items: center;">
			<image @click="cancel" src="/static/images/icon_guad.png"
				style="width: 120rpx;height: 120rpx;border-radius: 60rpx;" mode=""></image>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import {
		sub
	} from '@/common/event.js'
import utils from '../../../utils';
	export default {
		data() {
			return {
				id: '',
				data: {},
				wv:null,
			}
		},
		computed: {
			...mapState({

			})
		},
		onUnload() {
			this.$store.commit(`common/setStatusState`, "normal")
		},
		onLoad({
			id
		}) {
			this.id = id
			this.data = this.$store.state.address.friends.find(e => e.id == id)
			this.sendToUser()
			const _this = this
			// setTimeout(()=>{
			// 	console.log(44444444)
			// 	_this.$store.commit(`common/setStatusState`,"videomt")
			// 	_this.$store.commit(`common/setVideocallinfoState`,_this.data)
			// 	uni.redirectTo({
			// 		url:"/pages/chat/friend/videocallrtc?id="+id+"&name="+_this.data.name
			// 	})
			// },5000)
			
		},
		methods: {
			sendToUser: async function() {
				const ret = await utils.checkPermission("请打开摄像头和麦克风权限")
				if(ret){
					this.$store.commit(`common/setStatusState`, "videocall")
					this.$socket.send({
						type: "videocallinvite",
						data: {
							friend_id: this.data.id,
							friend_name: this.data.name,
							friend_avatar: this.data.avatar
						}
					})
				}
			},
			cancel: function() {
				this.$socket.send({
					type: "cancelvideocall",
					data: {
						friend_id: this.data.id,
						friend_name: this.data.name,
						friend_avatar: this.data.avatar
					}
				})
				uni.navigateBack()
			}
		}
	}
</script>

<style scoped>
	.content {
		width: 100%;
		height: 100vh;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background: linear-gradient(to bottom, #666, #222);
	}

	.ftbg {
		width: 100%;
		height: 100vh;
		top: 0rpx;
		left: 0rpx;
		background: #00000099;
		backdrop-filter: blur(20px);
		position: fixed;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
</style>